<template>
  <div>
    <h1>Cinema组件</h1>
    <select v-model="eTicketFlag">
      <option :value="0">第一种</option>
      <option :value="1">第二种</option>
    </select>
    <h4 v-for="cinema in cinemaList" :key="cinema.cinemaId">
      {{ cinema.name }}
    </h4>
  </div>
</template>
  
<script setup>
import { computed, onMounted, ref } from "vue";
import useCinemaStore from "../store/setupStore/cinemaStore";

const cinemaStore = useCinemaStore();
const eTicketFlag = ref(0);

const cinemaList = computed(() => {
  return cinemaStore.filterCinemaList(eTicketFlag.value);
});

onMounted(() => {
  if (cinemaStore.cinemaList.length == 0) {
    cinemaStore.getCinemaList();
  } 
});
</script>